<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('修改商品')" />
    <th:block th:include="include :: datetimepicker-css" />
    <th:block th:include="include :: summernote-css" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-goods-edit" th:object="${tGoods}">
            <input name="goodsId" th:field="*{goodsId}" type="hidden">
            <div class="form-group">    
                <label class="col-sm-3 control-label">商品名称：</label>
                <div class="col-sm-8">
                    <input name="goodsName" th:field="*{goodsName}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">商品价格：</label>
                <div class="col-sm-8">
                    <input name="goodsPrice" th:field="*{goodsPrice}" class="form-control" type="number">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">商品进价：</label>
                <div class="col-sm-8">
                    <input name="goodsPurPrice" th:field="*{goodsPurPrice}" class="form-control" type="number">
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">商品logo：</label>
                <div class="col-sm-8">
                    <input id="goodsSmallLogo" name="goodsSmallLogo" th:field="*{goodsSmallLogo}" class="form-control" >


                </div>
            </div>
<!--            <div class="form-group">    -->
<!--                <label class="col-sm-3 control-label">添加时间：</label>-->
<!--                <div class="col-sm-8">-->
<!--                    <div class="input-group date">-->
<!--                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>-->
<!--                        <input name="gddTime" th:value="${#dates.format(tGoods.gddTime, 'yyyy-MM-dd')}" class="form-control" placeholder="yyyy-MM-dd" type="text">-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--            <div class="form-group">    -->
<!--                <label class="col-sm-3 control-label">更新时间：</label>-->
<!--                <div class="col-sm-8">-->
<!--                    <div class="input-group date">-->
<!--                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>-->
<!--                        <input name="updTime" th:value="${#dates.format(tGoods.updTime, 'yyyy-MM-dd')}" class="form-control" placeholder="yyyy-MM-dd" type="text">-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
            <div class="form-group">    
                <label class="col-sm-3 control-label">商品介绍：</label>
                <div class="col-sm-8">
                    <input id="goodsIntroduce" name="goodsIntroduce" th:field="*{goodsIntroduce}"  class="form-control" type="hidden">
                    <div id="editor" class="summernote" ></div>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: datetimepicker-js" />
    <th:block th:include="include :: summernote-js" />
    <script type="text/javascript">
        var prefix = ctx + "wx/goods";
        $("#form-goods-edit").validate({
            focusCleanup: true
        });

        $(function() {
            $('#img').attr("src",$('#goodsSmallLogo').val())

            $('.summernote').summernote({
                placeholder: '请输入商品介绍',
                height : 192,
                lang : 'zh-CN',
                followingToolbar: false,
                callbacks: {
                    onImageUpload: function (files) {
                        sendFile(files[0], this);
                    }
                }
            });
            var content = $("#goodsIntroduce").val();
            $('#editor').summernote('code', content);
        });


        // 上传文件
        function sendFile(file, obj) {
            var data = new FormData();
            data.append("file", file);
            $.ajax({
                type: "POST",
                url: ctx + "common/upload",
                data: data,
                cache: false,
                contentType: false,
                processData: false,
                dataType: 'json',
                success: function(result) {
                    if (result.code == web_status.SUCCESS) {
                        $(obj).summernote('editor.insertImage', result.url, result.fileName);
                    } else {
                        $.modal.alertError(result.msg);
                    }
                },
                error: function(error) {
                    $.modal.alertWarning("图片上传失败。");
                }
            });
        }

        function uploadFile() {
            var formData = new FormData();
            if ($('#filePath')[0].files[0] == null) {
                $.modal.alertWarning("请先选择文件路径");
                return false;
            }
            formData.append('fileName', $("#fileName").val());
            formData.append('file', $('#filePath')[0].files[0]);
            $.ajax({
                url: ctx + "common/upload",
                type: 'post',
                cache: false,
                data: formData,
                processData: false,
                contentType: false,
                dataType: "json",
                success: function(result) {
                    if (result.code == web_status.SUCCESS) {
                        debugger
                        $('#goodsSmallLogo').val(result.url);

                    } else {
                        $.modal.alertError(result.msg);
                    }
                }
            });
        }
        function submitHandler() {
            if ($.validate.form()) {
                var sHTML = $('.summernote').summernote('code');
                $("#goodsIntroduce").val(sHTML);
                $.operate.save(prefix + "/edit", $('#form-goods-edit').serialize());
            }
        }

        $("input[name='gddTime']").datetimepicker({
            format: "yyyy-mm-dd",
            minView: "month",
            autoclose: true
        });

        $("input[name='updTime']").datetimepicker({
            format: "yyyy-mm-dd",
            minView: "month",
            autoclose: true
        });
    </script>
</body>
</html>